<!doctype html>
<!--[if lt IE 7]>      <html class="no-js lt-ie9 lt-ie8 lt-ie7" lang=""> <![endif]-->
<!--[if IE 7]>         <html class="no-js lt-ie9 lt-ie8" lang=""> <![endif]-->
<!--[if IE 8]>         <html class="no-js lt-ie9" lang=""> <![endif]-->
<!--[if gt IE 8]><!-->
<html lang="zxx">
<!--<![endif]-->

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>青廷科技</title>
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <link rel="apple-touch-icon" href="apple-touch-icon.png">
    <!-- favicon icon -->
    <link rel="shortcut icon" type="image/png" href="favicon.ico" />
    <link rel="stylesheet" href="css/font-awesome.min.css">
    <!-- color css -->
    <link rel="stylesheet" href="switcher/switcher.css" />
    <link rel="stylesheet" href="css/main.css">
    <link rel="stylesheet" href="css/colors/blue.css">
    <link rel="stylesheet" href="css/bootstrap.min.css">
    <link rel="stylesheet" href="css/bootstrap-theme.min.css">
    <link rel="stylesheet" href="css/bootstrap.css">
    <!-- Themify Icons -->
    <link rel="stylesheet" href="css/themify-icons.css">
    <!-- Magnific Popup -->
    <link rel="stylesheet" href="css/magnific-popup.css">
    <!-- Superfish -->
    <link rel="stylesheet" href="css/superfish.css">
    <link rel="stylesheet" href="css/style.css">
    <!--tabs-->
    <link href='css/style1.css' rel='stylesheet' type='text/css'>
    <!--zaixiankefu-->
    <link href='css/zzsc.css' rel='stylesheet' type='text/css'>
    <script src="js/modernizr-2.8.3-respond-1.4.2.min.js"></script>
</head>

<body data-spy="scroll" data-target=".navbar" data-offset="50" style="overflow: visible;">
<!--[if lt IE 8]>
<p class="browserupgrade">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p>
<![endif]-->

<!-- ===========================
			PRELOADER
============================= -->

<div id="preloader">
    <div id="status"></div>
</div>

<!-- End Preloader -->
<!-- =========================
    page header START
============================== -->
<!--
Fixed Navigation
==================================== -->
<header id="navigation" class="navbar-inverse navbar-fixed-top animated-header">
    <div class="container">
        <div class="navbar-header">
            <!-- responsive nav button -->
            <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                <span class="sr-only">Toggle navigation</span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>

            <h1 class="navbar-brand">
                <a href="#slides"><img width="100px" height="45px" src="images/logo.png" alt="青廷科技"></a>
            </h1>
            <!-- /logo -->
        </div>

        <!-- main nav -->
        <nav class="collapse navbar-collapse navbar-right" role="navigation">
            <ul class="nav navbar-nav pull-right">
                <li ><a href="#slides">首页</a></li>
                <li><a href="#karbar-how-it-works-section">发现小程序</a></li>
                <li><a href="#karbar-service-section">小程序案例</a></li>
                <li><a href="#karbar-customize-section">小程序定制</a></li>
                <li><a href="#karbar-team-section">青廷动态</a></li>
                <li><a  href="#karbar-why-choose-section">联系我们</a></li>
            </ul>
        </nav>
        <!-- /main nav -->
    </div>
</header>
<!--
End Fixed Navigation
<!-- =========================
		home slider section
 ============================== -->
<section id="slides" class="pb">
    <div class="slides-container">
        <div class="slide active">
            <div class="img" ><img src="images/large.png" alt="slide" class="img-responsive"></div>
            <div class="overlay"></div>
            <div class="slide-caption">
                <div class="container">
                    <div class="box">
                        <h1>青廷科技</h1>
                        <span>移动互联新生代</span>
                    </div>
                </div>
            </div>
        </div>
        <!-- end slide1 -->
        <div class="slide">
            <div class="img"><img src="images/slider/slide2.jpg" alt="slide" class="img-responsive"></div>
            <div class="overlay"></div>
            <div class="slide-caption">
                <div class="container">
                    <div class="box">
                        <h1>青廷科技</h1>
                        <span>移动互联新生代</span>
                    </div>
                </div>
            </div>
        </div>
        <!-- end slide2 -->
    </div>
    <!-- end slides-container -->
    <div class="slides-navigation">
        <a class="prev sqaureIconSec" href="#"> <i class="fa fa-chevron-left"></i></a>
        <a class="next sqaureIconSec" href="#"> <i class="fa fa-chevron-right"></i></a>
    </div>
    <!-- end slides-navigation -->
    <div class="holder">
	  <span class="scroll-btn">
		<a href="#karbar-how-it-works-section">
			<span class="mouse">
				<span>
				</span>
			</span>
		</a>
	</span>
        <i class="fa fa-chevron-down moreArrow moving"></i>
    </div>

</section>
<!-- end slider -->

<!-- =========================
       How it works section
============================== -->
<section id="karbar-how-it-works-section" class="how-it-works section-bg-color">
    <div class="container">
        <div class="row">
            <!-- Section main title -->
            <div class="col-xs-12 section-title-padding">
                <div class="sec-title-container text-center">
                    <h2 class="uppercase font-weight-7 less-mar-1">发现小程序</h2>
                    <div class="title-line"></div>
                    <div class="clearfix"></div>
                    <p class="by-sub-title">微信小程序是一种全新的连接用户与服务的方式，它可以在微信内被便捷地获取和传播，同时具有出色的使用体验。</p>
                </div>
            </div>
            <div class="clearfix"></div>
            <div class="col-md-11 center-block">
                <!--step 1-->
                <div class="row">
                    <div class="col-md-6 col-md-push-6 text-center"> <img src="images/step1.png" alt="step-1"> </div>
                    <div class="col-md-6 col-md-pull-6 reveal-left-fade">
                        <div class="step-number"><span>1</span></div>
                        <h4>无须安装 触手可及</h4>
                        <p></p>
                        <p>微信小程序与APP相比，APP需要安装，需要消耗流量，占用手机有限的桌面空间，所以微信小程序胜在无需安装，进一步优化了用户体验。</p>
                            <p>微信小程序进一步扩展了二维码的能力。
                            用户通过扫一扫或者搜一下即可打开应用，它实现了应用“触手可及”的梦想 。</p>
                    </div>
                </div>
                <!--step 1 end-->
                <!--step 2-->
                <div class="row">
                    <div class="col-md-6 text-center"> <img src="images/step-2.svg" alt="step-2"> </div>
                    <div class="col-md-6 reveal-right-fade">
                        <div class="step-number"><span>2</span></div>
                        <h4>用完即走 无须卸载</h4>
                        <p></p>
                        <p>体现了“用完即走”的理念，用户不用关心是否安装太多应用的问题。应用将无处不在，随时可用，但又无需安装卸载。</p>
                    </div>
                </div>
                <!--step 2 end-->
                <!--step 3-->
                <div class="row">
                    <div class="col-md-6 col-md-push-6 text-center"> <img src="images/step-3.svg" alt="step-3"> </div>
                    <div class="col-md-6 col-md-pull-6 reveal-left-fade">
                        <div class="step-number"><span>3</span></div>
                        <h4>没有入口 也是最大的入口</h4>
                        <p></p>
                        <p>可以分享到微信群，实时信息共享，这将会产生极大的口碑传播。没有入口，也是最大的入口。</p>
                    </div>
                </div>
                <!--step 3 end-->
                <!--step 4-->
                <div class="row">
                    <div class="col-md-6 text-center"> <img src="images/step-4.svg" alt="step-4"> </div>
                    <div class="col-md-6 reveal-right-fade">
                        <div class="step-number"><span>4</span></div>
                        <h4>钱景无限</h4>
                        <p></p>
                        <p>过去公众号苦于图文页无法支持链接，小程序的出现无疑提高了用户的购买体验，电商也将迎来一个火热的夏天。</p>
                            <p>小程序提供了一项新能力——“附近的小程序”，可以帮助商户快速、低门槛地在指定地点展示小程序，以方便被周围的用户找到并使用。</p>
                    </div>
                </div>
                <!--step 4 end-->
            </div>
        </div>
    </div>
</section>
<!--How it works end-->
<!-- =========================
       service section
============================== -->

<section id="karbar-service-section">
    <div class="container">
        <div class="row">
            <!-- Section main title -->
            <div class="col-xs-12 section-title-padding">
                <div class="sec-title-container text-center">
                    <h2 class="uppercase font-weight-7 less-mar-1">小程序案例</h2>
                    <div class="title-line"></div>
                    <div class="clearfix"></div>
                    <p class="by-sub-title">扫一扫小程序码体验 发现不一样的轻便</p>
                </div>
            </div>
            <div class="clearfix"></div>
            <!--end title-->
            <ul class="project-wrapper wow animated fadeInUp">
                <li class="portfolio-item">
                    <img src="images/lanji.jpg" class="img-responsive" alt="澜记">
                    <figcaption class="mask">
                        <h3>澜记</h3>
                        <img src="images/lanjir.jpg" alt="澜记小程序码">
                    </figcaption>
                </li>

                <li class="portfolio-item">
                    <img src="images/yunke.jpg" class="img-responsive" alt="云章 ">
                    <figcaption class="mask">

                        <h3>云刻</h3>
                        <img src="images/yunker.jpg" alt="云章小程序码">
                    </figcaption>
                </li>

                <li class="portfolio-item">
                    <img src="images/xinmei.jpg" class="img-responsive" alt="新媒在线 ">
                    <figcaption class="mask">
                        <h3>新媒在线</h3>
                        <img  src="images/xinmeir.jpg" alt="新媒在线小程序码">
                    </figcaption>
                </li>
                <li class="portfolio-item">
                    <img src="images/moqu.jpg" class="img-responsive" alt="默趣 ">
                    <figcaption class="mask">
                        <h3>默趣</h3>
                        <img  src="images/moqur.jpg" alt="默趣小程序码">
                    </figcaption>
                </li>
            </ul>
        </div>
    </div>
</section>

<!-- end services -->

<!-- =========================
     why choose section
============================== -->
<section id="karbar-customize-section" class="karbar-customize-section section-bg-color">
    <div class="container">
        <div class="row">
            <!-- Section main title -->
            <div class="col-xs-12 section-title-padding">
                <div class="sec-title-container text-center">
                    <h2 class="uppercase font-weight-7 less-mar-1">小程序定制</h2>
                    <div class="title-line"></div>
                    <div class="clearfix"></div>
                    <p class="by-sub-title">小程序定制</p>
                </div>
            </div>
            <div class="clearfix"></div>
            <div class="col-md-11 center-block">
                <!--step 1-->
                <div class="row">
                    <div class="col-md-6 col-md-push-6 text-center"> <img src="images/step-2.svg" alt="step-1"> </div>
                    <div class="col-md-6 col-md-pull-6 reveal-left-fade">
                        <div class="step-number"><span>1</span></div>
                        <h4>提交需求 需求对接</h4>
                        <p></p>
                        <p>强化服务意识 主动对接需求</p>
                    </div>
                </div>
                <!--step 1 end-->
                <!--step 2-->
                <div class="row">
                    <div class="col-md-6 text-center"> <img src="images/step-4.svg" alt="step-2"> </div>
                    <div class="col-md-6 reveal-right-fade">
                        <div class="step-number"><span>2</span></div>
                        <h4>方案制定 最终方案</h4>
                        <p></p>
                        <p>根据需求文档制定方案，获得反馈建议后进行修改，制定最终方案。</p>
                    </div>
                </div>
                <!--step 2 end-->
                <!--step 3-->
                <div class="row">
                    <div class="col-md-6 col-md-push-6 text-center"> <img src="images/step1.png" alt="step-3"> </div>
                    <div class="col-md-6 col-md-pull-6 reveal-left-fade">
                        <div class="step-number"><span>3</span></div>
                        <h4>模板开发 初版预览</h4>
                        <p></p>
                        <p>根据最终方案进行模板开发，客户初版预览并反馈，产品定型。</p>
                    </div>
                </div>
                <!--step 3 end-->
                <!--step 4-->
                <div class="row">
                    <div class="col-md-6 text-center"> <img src="images/step-3.svg" alt="step-4"> </div>
                    <div class="col-md-6 reveal-right-fade">
                        <div class="step-number"><span>4</span></div>
                        <h4>产品诞生 发布上线</h4>
                        <p></p>
                        <p>产品诞生，部署上线。</p>
                    </div>
                </div>
                <!--step 4 end-->
            </div>
        </div>
    </div>
</section>

<!-- =========================
	   team section
 ============================== -->
<section id="karbar-team-section">
    <div class="awesome-team-members">
        <div class="container">
            <div class="row">
                <!-- Section main title -->
                <div class="col-xs-12 section-title-padding">
                    <div class="sec-title-container text-center">
                        <h2 class="uppercase font-weight-7 less-mar-1">青廷动态</h2>
                        <div class="title-line"></div>
                        <div class="clearfix"></div>
                        <p class="by-sub-title">青廷动态</p>
                    </div>
                </div>
                <div class="clearfix"></div>
                <!--end title-->

                <div class="row">
                    <div class="col-md-offset-0 col-md-12">
                        <div class="tab" role="tabpanel">
                            <!-- Nav tabs -->
                            <ul class="nav nav-tabs" role="tablist">
                                <li role="presentation" class="active"><a href="#Section6" aria-controls="home" role="tab" data-toggle="tab"><i class="fa fa-info"></i>最新动态</a></li>
                                <li role="presentation"><a href="#Section7" aria-controls="profile" role="tab" data-toggle="tab"><i class="fa fa-briefcase"></i>企业文化</a></li>
                                <li role="presentation"><a href="#Section8" aria-controls="messages" role="tab" data-toggle="tab"><i class="fa fa-user-plus"></i>招聘启事</a></li>
                            </ul>

                            <!-- Tab panes -->
                            <div class="tab-content tabs">
                                <div role="tabpanel" class="tab-pane fade in active" id="Section6">
                                    <h3>最新动态</h3>
                                    <ul class="process-icon">
                                        <li class="news-item">
                                            <table cellpadding="4" >
                                                <tr>
                                                    <td><img src="images/dongtai1.jpg" width="60" class="img-circle" /></td>
                                                    <th>&nbsp;&nbsp;&nbsp;<a href="#"> 面对不一样的小程序，你准备好了吗？</a><br/>&nbsp;&nbsp;&nbsp;2017.05.11</th>
                                                </tr>
                                            </table>
                                            <div>
                                                <p>小程序经历了这么多，如今来看，似乎是起航的时候了。但就在22号凌晨1点多，微信公众平台悄悄的发布了又一个新功能，这个新功能也许将是小程序自诞生以来...</p>
                                            </div>
                                        </li>
                                        <li class="news-item">
                                            <table cellpadding="4" >
                                                <tr>
                                                    <td><img src="images/xcx.png" width="60" class="img-circle" /></td>
                                                    <th>&nbsp;&nbsp;&nbsp;<a href="#">你再不理小程序，微信就不理你了</a><br/>&nbsp;&nbsp;&nbsp;2017.05.11</th>
                                                </tr>
                                            </table>
                                            <div>
                                                <p>上周微信小程序连续放出大招：1.放开了小程序和公众号的关联规则，一个公众号可以关联三个不同主体的小程序，相应一个小程序可管理最多三个公众号...</p>
                                            </div>
                                        </li>
                                        <li class="news-item">
                                            <table cellpadding="4" >
                                                <tr>
                                                    <td><img src="images/fujin.jpg" width="60" class="img-circle" /></td>
                                                    <th>&nbsp;&nbsp;&nbsp;<a href="#"> 附近的小程序正式上线！这些东西你一定要知道</a><br/>&nbsp;&nbsp;&nbsp;2017.05.11</th>
                                                </tr>
                                            </table>
                                            <div>
                                                <p>昨天深夜，微信又放了个大招。半夜12点整，[知晓程序]发现，微信的小程序页面顶部，出现了一个新的入口。没错，[附近的小程序]功能终于开放了！那么，该怎么...</p>
                                            </div>
                                        </li>
                                    </ul>
                                    <div style="float: right"><a href="#"  >查看更多</a></div>
                                </div>
                                <div class="clearfix"></div>

                                <div role="tabpanel" class="tab-pane fade" id="Section7">
                                    <h3>企业文化</h3>
                                    <ul class="process-icon">
                                    <li class="news-item">
                                        <table cellpadding="4" >
                                            <tr>
                                                <td><img src="images/large.png" width="60" class="img-circle" /></td>
                                                <th>&nbsp;&nbsp;&nbsp;<a href="#"> 茂名青廷科技有限公司</a><br/>&nbsp;&nbsp;&nbsp;2017.05.11</th>
                                            </tr>
                                        </table>
                                        <div>
                                            <p>茂名青廷科技有限公司是一家以研发移动互联网产品为主，为客户所在行业提供深度“互联网+”解决方案以及本土人才发展战略三位一体的互联网公司...</p>
                                        </div>
                                    </li>
                                    <li class="news-item">
                                            <table cellpadding="4" >
                                                <tr>
                                                    <td><img src="images/qiye.jpg" width="60" class="img-circle" /></td>
                                                    <th>&nbsp;&nbsp;&nbsp;<a href="#">青廷的企业文化和价值观</a><br/>&nbsp;&nbsp;&nbsp;2017.05.11</th>
                                                </tr>
                                            </table>
                                            <div>
                                                <p>第一板块：十二条令 如何“看” 1.确认指令：收到指令要确认，对于需要负责执行的指令要回复简要执行计划及预期时间和结果。2.及时通报...</p>
                                            </div>
                                        </li>
                                    <li class="news-item">
                                        <table cellpadding="4" >
                                            <tr>
                                                <td><img src="images/per.png" width="60" class="img-circle" /></td>
                                                <th>&nbsp;&nbsp;&nbsp;<a href="#"> 工作的评价和反馈机制</a><br/>&nbsp;&nbsp;&nbsp;2017.05.11</th>
                                            </tr>
                                        </table>
                                        <div>
                                            <p>我们在每个季度结束时会进行一次 performance review，即工作的评价和反馈。流程一定程度上借鉴了 Google 的 performance review，但有不少简化和修改，以避免给大家造成额外的负担，毕竟我们的主要精力应该放在改进产品而不是处理内部流程上....</p>
                                        </div>
                                    </li>
                                </ul>
                                    <div style="float: right"><a href="#" >查看更多</a></div>
                                </div>
                                <div class="clearfix"></div>

                                <div role="tabpanel" class="tab-pane fade" id="Section8">
                                        <h3>招聘启事</h3>
                                    <ul class="process-icon">
                                        <li class="news-item">
                                            <table cellpadding="4" >
                                                <tr>
                                                            <td><img src="images/php.jpg" width="60" class="img-circle" /></td>
                                                            <th>&nbsp;&nbsp;&nbsp;<a href="#"> 诚招PHP程序员</a><br/>&nbsp;&nbsp;&nbsp;2017.05.11</th>
                                                        </tr>
                                                    </table>
                                                    <div>
                                                        <p>岗位职责：完成客户产品开发、操作后台以及相关系统开发。职位要求：1.熟练使用PHP、JavaScript、Java等语言，能独立完成功能模板开发。2.熟悉HTML/CSS/JS/jQuery，熟悉一定的PHP框架，熟悉设计模式、把设计模式合理地引...</p>
                                                    </div>
                                                </li>
                                                <li class="news-item">
                                                    <table cellpadding="4" >
                                                        <tr>
                                                            <td><img src="images/h5.jpg" width="60" class="img-circle" /></td>
                                                            <th>&nbsp;&nbsp;&nbsp;<a href="#"> 网页设计师</a><br/>&nbsp;&nbsp;&nbsp;2017.05.11</th>
                                                        </tr>
                                                    </table>
                                                    <div>
                                                        <p>岗位职责：1.设计专题页面、网站前端页面、广告图片、宣传册等；2.负责网站的建设、网站专题、网络推广等美术创意工作；3.负责项目整体网页设计方面的统筹工作。职位要求：
                                                            1、平面设计或计算机相关专业，有网页设计工作经验者优先...</p>
                                                    </div>
                                                </li>
                                                <li class="news-item">
                                                    <table cellpadding="4" >
                                                        <tr>
                                                            <td><img src="images/fangan1.jpg" width="60" class="img-circle" /></td>
                                                            <th>&nbsp;&nbsp;&nbsp;<a href="#"> 产品经理</a><br/>&nbsp;&nbsp;&nbsp;2017.05.11</th>
                                                        </tr>
                                                    </table>
                                                    <div>
                                                        <p>岗位职责：1.根据市场动态分析项目及用户需求，提出产品需求或改进意见；2.根据产品的功能，协调市场、开发、运营、管理等团队确立产品方案；3、 研究市场和用户需求，不断优化产品，提高用户体验及活跃度，同时策划有竞争力的产品...</p>
                                                    </div>
                                                </li>
                                            </ul>
                                    <div style="float: right"><a href="#"  >查看更多</a></div>
                                </div>
                                <div class="clearfix"></div>
                        </div>
                    </div>
                </div>
                <!--end item-->
            </div>
        </div>
    </div>
    </div>
</section>
<!-- end team section -->

<!--contact-->
<section id="karbar-why-choose-section" class="section-light why-choose-us">
    <div class="container">
        <div class="row">
            <div class="col-md-7">
                <div class="k-why-choose-us-main">
                    <div class="k-why-choose-us margin-bottom"> <img src="images/taidu.png"  alt="" class="img-responsive"> </div>
                    <div class="border-box"></div>
                </div>
            </div>
            <!--end item-->
            <div class="col-md-5 padding-left-4">
                <div class="col-xs-12 nopadding">
                    <div class="sec-title-container text-center">
                        <h3 class="uppercase font-weight-7 nopadding ce-title"><span>联系我们</span></h3>
                        <div class="title-line less-mar"></div>
                        <p>联系我们</p>
                    </div>
                </div>
                <div class="clearfix"></div>
                <!--end title-->
                <div class="why-choose-single reveal-right-fade">
                    <div class="iconbox-smedium white left round icon"><span><i class="fa fa-phone" aria-hidden="true"></i></span></div>
                    <div class="text-box-right">
                        <h4 class="less-mar-4">欢迎致电垂询</h4>
                        <p>(000) 124-5678</p>
                    </div>
                </div>
                <div class="why-choose-single reveal-right-fade">
                    <div class="iconbox-smedium white left round icon"><span><i class="fa fa-envelope" aria-hidden="true"></i></span></div>
                    <div class="text-box-right">
                        <h4 class="less-mar-4">邮箱联系</h4>
                        <p>website@yourname.com</p>
                    </div>
                </div>
                <div class="why-choose-single reveal-right-fade">
                    <div class="iconbox-smedium white left round icon"><span><i class="fa fa-map-marker" aria-hidden="true"></i></span></div>
                    <div class="text-box-right">
                        <h4 class="less-mar-4">公司地址</h4>
                        <p>广东省茂名市文明北路339号大院（中汇广场三层）1号304B号青廷科技有限公司</p>
                    </div>
                </div>
            </div>
            <!--end item-->
        </div>
    </div>
</section>
<!-- end why choose -->

<!-- =========================
       Gmap, ContactForm section
============================== -->
<!-- footer -->
<section id="karbar-footer-section">
<footer id="footer">
    <div class="container">
                <div class="row text-center">
                    <div class="footer-content">
                        <div class="col-md-3 col-sm-6 col-xs-12 text-center wow animated zoomInLeft">
                        <div class="wow animated fadeInDown">
                            <p><i class="fa fa-server fa-1x"></i>&nbsp;关于我们</p>
                            <address class="contact-details">
                                <p><a href="#">服务条款</a> </p>
                                <p><a href="#">关于我们</a> </p>
                                <p><a href="#">商务合作</a> </p>
                            </address>
                        </div>
                        </div>
                        <div class="col-md-3 col-sm-6 col-xs-12 text-center wow animated zoomInLeft">
                        <div class="wow animated fadeInDown">
                            <p><i class="fa fa-phone fa-1x"></i>&nbsp;联系我们</p>
                            <address class="contact-details">
                                <p>电话：(000) 124-5678 </p>
                                <p>邮箱：website@yourname.com</p>
                                <p>地址：广东省茂名市文明北路339号大院（中汇广场三层）1号304B号青廷科技有限公司</p>
                            </address>
                        </div>
                        </div>
                        <div class="col-md-3 col-sm-6 col-xs-12 text-center wow animated zoomInLeft">
                        <div class="wow animated fadeInDown">
                            <p>
                                <img alt="微信公众号" src="images/qingtingtech.jpg" width="100px" height="100px">
                            </p>
                            <p>青廷科技官方公众号</p>
                        </div>
                        </div>
                        <div class="col-md-3 col-sm-6 col-xs-12 text-center wow animated zoomInLeft">
                        <div class="wow animated fadeInDown">
                            <p>
                                <img alt="微信公众号" src="images/qingtingr.jpg" width="100px" height="100px">
                            </p>
                            <p>青廷科技官方小程序</p>
                        </div>
                    </div>
                    </div>
                </div>
                <div class="row text-center">
                    <div class="footer-content">
                        <div class="row text-center">
                            <p>Copyright &copy; 2017.<a target="_blank" href="http://qingtingtech.com/">青廷科技有限公司.</a></p>
                        </div>
                    </div>
                </div>
            </div>
</footer>
</section>

<!--右侧悬浮菜单-->

<div class="main-im">
    <div id="open_im" class="open-im">&nbsp;</div>
    <div class="im_main" id="im_main">
        <div id="close_im" class="close-im"><a href="javascript:void(0);" title="点击关闭">&nbsp;</a></div>
        <a href="http://wpa.qq.com/msgrd?v=3&uin=123456789&site=qq&menu=yes" class="im-qq qq-a" title="在线QQ客服">
            <div class="qq-container"></div>
            <div class="qq-hover-c"><img class="img-qq" src="images/qq.png"></div>
            <span> QQ在线咨询</span> </a>
        <div class="im-tel">
            <div>业务咨询热线</div>
            <div class="tel-num">000-123-4567</div>
        </div>
        <div class="im-footer" style="position:relative">
            <div class="weixing-container">
                <div class="weixing-show">
                    <div class="weixing-txt">关注微信咨询</div>
                    <img class="weixing-ma" src="images/qingtingtech.jpg">
                    <div class="weixing-sanjiao"></div>
                    <div class="weixing-sanjiao-big"></div>
                </div>
            </div>
            <div class="go-top"><a href="javascript:;" title="返回顶部"></a> </div>
            <div style="clear:both"></div>
        </div>
    </div>
</div>

<!-- end Gmap ContactForm -->

<script src="js/jquery-1.8.3.min.js"></script>
<!-- plugin js -->
<script src="js/plugins.js"></script>
<!-- super slider -->
<script type="text/javascript" src="js/jquery.superslides.min.js"></script>
<!-- contact js -->
<script src="js/jquery-contact.js"></script>
<!-- retina js -->
<script src="js/retina.min.js"></script>
<!-- mailchimp -->
<script src="js/jquery.ajaxchimp.min.js"></script>
<!-- scroll animatin JS -->
<script src="js/scrollreveal.min.js"></script>
<script src="js/main.js"></script>
<!-- color js -->
<script src="switcher/switcher.js"></script>

<script>
    $(function(){
        $('#close_im').bind('click',function(){
            $('#main-im').css("height","0");
            $('#im_main').hide();
            $('#open_im').show();
        });
        $('#open_im').bind('click',function(e){
            $('#main-im').css("height","272");
            $('#im_main').show();
            $(this).hide();
        });
        $('.go-top').bind('click',function(){
            $(window).scrollTop(0);
        });
        $(".weixing-container").bind('mouseenter',function(){
            $('.weixing-show').show();
        })
        $(".weixing-container").bind('mouseleave',function(){
            $('.weixing-show').hide();
        });
    });
</script>

</body>
</html>


